<template>
	<div class="main">
		<div class="main-header">
			<!-- <el-button
                v-for="(item, index) in buttons"
                :key="index"
                :type="item.path | formatType"
                :icon="item.icon"
                :disabled="item.path | formatDisabled(selection)"
                @click="tapButton(item)"
                >{{ item.title }}</el-button
            > -->
			<el-button type="primary" @click="addcustomer()">添加</el-button>
			<el-button type="primary" @click="selectdel()">批量删除</el-button>
		</div>
		<el-table ref="table" class="main-table" :data="memberData" height="100%" border
			header-cell-class-name="main-table-header" @selection-change="onSelectionChange">
			<el-table-column type="selection" width="40"></el-table-column>
			<!-- <el-table-column align="center"  label="客户等级、行业、类型、来源" prop="type">
				<template slot-scope="scope">
					{{customerstatus[scope.row.type-1]}}
				</template>
			</el-table-column> -->
			<el-table-column align="center" label="id" prop="id" />
			<el-table-column align="center" label="入库分类类型" prop="name" />
			<!-- <el-table-column align="center" label="公司联系电话" prop="create_time" /> -->
			<el-table-column align="center" label="操作">
				<template slot-scope="scope">
					<el-button type="primary" @click.stop="addcustomer(scope.row)" size="small">编辑</el-button>
					<el-button type="primary" @click.stop="del(scope.row)" size="small">删除</el-button>
				</template>
			</el-table-column>
		</el-table>
		<el-pagination class="main-pagination" :current-page.sync="page" :page-size="limit" :total="total"
			@current-change="onCurrentChange" layout="total,jumper,prev,pager,next"></el-pagination>
		<el-dialog :visible.sync="dialogVisible" :title="dialogTitle" append-to-body width="1100px"
			@close="onDialogClose"  :key="formDataStatus">
			<component :is="dialogView" @update="getMemberData" @search="add" :selection="selection"
				:formData="formData" ></component>
		</el-dialog>
		<!-- <Info ref="info" :selection="selection" @close="onDialogClose" /> -->
	</div>
</template>

<script>
	import {
		get,post,del
	} from "@/assets/js/http.js";
	export default {
		name: "view-custinfo",
		data() {
			return {
				memberData: [],
				selection: [],
				page: 1,
				limit: 20,
				total: 0,
				dialogVisible: false,
				dialogTitle: "",
				dialogView: "",
				formData:{},
				customerstatus: ['客户等级','客户来源','客户行业','客户类型'], //1客户等级2客户来源3客户行业4客户类型
				ids:[],
				formDataStatus:false,
			};
		},
		computed: {
			buttons() {
				return this.$store.state.buttons;
			}
		},
		components: {
			// Photo: () => import("./photo.vue"),
			Add: () => import("./classadd.vue"),
			// Info: () => import("./info.vue")
		},
		mounted() {
			this.getMemberData();
		},
		methods: {
			//添加弹窗
			addcustomer(info) {
				if (info) {
					this.dialogTitle = "编辑";
					this.formData = info
				} else {
					this.dialogTitle = "添加";
					this.formData = {}
				}
				this.dialogView = "Add";
				this.dialogVisible = true;
			},
			//编辑，添加
			async add(result) {
				const infos = JSON.parse(JSON.stringify(result));
				this.page = 1;
				console.log(infos, 11,this.dialogTitle);
				if(this.dialogTitle=='编辑'){
					await post({
						url:'/admin/customer.Supplier/cate_edit',
						data:infos
					})
				}else{
					await post({
						url:'/admin/customer.Supplier/cate_add',
						data:infos
					})
				}
				this.formDataStatus = true
				this.getMemberData()
			},
			//获取列表
			async getMemberData() {
				const data = await get({
					url: "/admin/customer.Supplier/cate_list",
					loading: true,
					params: {
						page: this.page,
						limit: this.limit
					}
				});
				const list = data.data;
				this.total = data.total;
				this.memberData = list;
			},
			//批量删除
			async selectdel(){
				if(!this.selection){
					this.$message('请选择')
				}else{
					for(let i=0;i<this.selection.length;i++){
						this.ids.push(this.selection[i].id)
					}
					console.log(this.ids)
					this.$confirm("此操作将永久删除文件, 是否继续?", "提示", {
							confirmButtonText: "确定",
							cancelButtonText: "取消",
							type: "warning",
						})
						.then(async () => {
							let query = "?";
							for (let i = 0; i < this.ids.length; i++) {
								const item = this.ids[i];
								console.log(item, 123);
								if (i > 0) {
									query += "&ids[]=" + item;
								} else {
									query += "ids[]=" + item;
								}
							}
							console.log(query,"/admin/customer.Supplier/cate_del" + query);
							await del({
								url: "/admin/customer.Supplier/cate_del" + query,
								successTip: true,
								loading: true,
							});
							this.ids=[]
							this.getMemberData();
						})
						.catch(() => {
							this.$message({
								type: "info",
								message: "已取消删除",
							});
						});
				}
			},
			//删除
			del(row) {
				console.log("del", row);
				this.$confirm("此操作将永久删除该文件, 是否继续?", "提示", {
						confirmButtonText: "确定",
						cancelButtonText: "取消",
						type: "warning",
					})
					.then(async () => {
						let ids = [];
						ids.push(row.id);
						ids.map(String);
						console.log(ids, "ids");
						let query = "?";
						for (let i = 0; i < ids.length; i++) {
							const item = ids[i];
							console.log(item, 123);
							if (i > 0) {
								query += "&ids[]=" + item;
							} else {
								query += "ids[]=" + item;
							}
						}
						console.log(query,"/admin/customer.Supplier/cate_del" + query);
						await del({
							url: "/admin/customer.Supplier/cate_del" + query,
							successTip: true,
							loading: true,
						});
						this.getMemberData();
					})
					.catch(() => {
						this.$message({
							type: "info",
							message: "已取消删除",
						});
					});
			
			},
			//分页
			onCurrentChange(index) {
				this.page = index;
				this.getMemberData();
			},
			onSearch() {
				this.dialogTitle = "搜索";
				this.dialogView = "Search";
				this.dialogVisible = true;
			},
			onSelectionChange(selection) {
				this.selection = selection;
			},
			onDialogClose() {
				this.$refs.table.clearSelection();
			},
		}
	};
</script>
